import React from 'react'
import "./Wode.css"
import Banner from "./components/Banner"
// 引入图片
import wode from "../../assets/img/wode.jpg"
import wode1 from "../../assets/img/wode1.jpg"
import wode11 from "../../assets/img/wode11 (1).jpg"
import wode12 from "../../assets/img/wode11 (2).jpg"
import wode13 from "../../assets/img/wode11 (3).jpg"
import wode14 from "../../assets/img/wode11 (4).jpg"
import dizhi1 from "../../assets/img/dizhi1.png"
import dizhi2 from "../../assets/img/dizhi2.png"
import dizhi3 from "../../assets/img/dizhi3.png"
import dizhi4 from "../../assets/img/dizhi4.png"
import dizhi5 from "../../assets/img/dizhi5.png"
export default function Wode(props) {
    const goBack=()=>{
        props.history.go(-1)
    }
    return (
        <div id="box">
            <div id="top11">
                {/* 最顶端部分  */}
                <div id="top1">
                    <i className="iconfont ii" onClick={()=>goBack()}>&#xe6bc;</i>
                    <h2>我的</h2>
                </div>
                {/* 头像部分 */}
                <div id="touxiang">
                    <div className="d1">
                        <img src={wode} alt="" />
                    </div>
                    <div className="d2">
                        <p>代用名</p>
                        <i>完善资料让小U更懂您</i>
                    </div>
                    <div className="d3">
                        <img src={wode1} alt="" />
                    </div>
                </div>
                {/* 头像下面部分  */}
                <div id="shoucang">
                    <p>
                        <span>12</span>
                        <i>我的收藏</i>
                    </p>
                    <p>
                        <span>12</span>
                        <i>浏览记录</i>
                    </p>
                    <p>
                        <span>￥0</span>
                        <i>我的红包</i>
                    </p>
                    <p>
                        <span>12</span>
                        <i>优惠券</i>
                    </p>
                </div>
            </div>
            {/* 我的订单部分 */}
            <div id="dingdan">
                <div className="wode1">
                    <p>我的订单</p>
                    <span className="iconfont">全部订单&#xe601;</span>
                </div>
                <div className="dingdan1">
                    <p>
                        <img src={wode11} alt="" />
                        <i>代付款</i>
                    </p>
                    <p>
                        <img src={wode12} alt="" />
                        <i>代收货</i>
                    </p>
                    <p>
                        <img src={wode13} alt="" />
                        <i>&nbsp;评价</i>
                    </p>
                    <p>
                        <img src={wode14} alt="" />
                        <i>售后/退款</i>
                    </p>
                </div>
            </div>
            {/* 轮播图 */}
            <Banner></Banner>
            {/* 地址部分  */}
            <div id="dizhi">
                <div className="dizhi1">
                    <img src={dizhi1} alt="" />
                    <p>地址管理</p>
                </div>
                <div className="dizhi1">
                    <img src={dizhi2} alt="" />
                    <p>我的钱包</p>
                </div>
                <div className="dizhi1">
                    <img src={dizhi3} alt="" />
                    <p>我的二维码</p>
                </div>
                <div className="dizhi2">
                    <img src={dizhi4} alt="" />
                    <p>我的小伙伴</p>
                </div>
                <div className="dizhi1">
                    <img src={dizhi5} alt="" />
                    <p>0元试用</p>
                </div>
            </div>

        </div>
    )
}
